import { THEME_DARK,ThemeColorVar } from "./static";
import { ref } from "vue";

// THEMECOLOR 的key值
const THEMECOLOR_STORE_KEY = "THEMECOLOR_STORE"
// 用于存储当前主题
let current_theme = ref([])

class THEME {
    constructor() {
        this.init()
    }

    /**
     * 主题颜色初始化
     */
    init() {
        this.ColorVarInit(this.getLocalColor())
    }
    
    /**
     * 主题初始化颜色
     */
    ColorVarInit(ThemeColor) {
        current_theme.value = ThemeColorVar.map((item, index) => {
            item.value = ThemeColor[index] || "#000"
            return item
        })
        current_theme.value.forEach(item => {
            document.documentElement.style.setProperty(item.var,item.value)
        });
    }

    /**
     * 获取本地主题信息
     */
    getLocalColor() {
        return JSON.parse(window.localStorage.getItem(THEMECOLOR_STORE_KEY)) || THEME_DARK 
    }
}

/**
 * 主题实例
 */
let themeInstance = new THEME() || null
export function createTheme() {
    if (!themeInstance) {
        themeInstance = new THEME()
    }
    return themeInstance
}
export function getThemeInstance() {
    return themeInstance
}



